/* 状态Tab样式 */
.status-tabs {
    display: flex;
    background-color: white;
    border-bottom: 1px solid #eee;
}

.status-tab {
    flex: 1;
    text-align: center;
    padding: 12px 0;
    font-size: 15px;
    color: #666;
    position: relative;
}

.status-tab.active {
    color: #1AAD19;
}

.status-tab.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #1AAD19;
}



.weui-panel {
    margin: 10px;
    border-radius: 8px;
    overflow: hidden;
    background-color: white;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

.weui-panel__hd {
    padding: 12px 15px;
    font-size: 15px;
    color: #333;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.total-recharge {
    font-size: 14px;
    color: #666;
}

.total-recharge span {
    color: #E64340; /* 总金额红色 */
    font-weight: 500;
}

.record-list {
    background-color: #f9f9f9; /* 父容器用页面底色，与子项白色背景形成对比 */
    padding: 8px 15px; /* 上下内边距：让首项顶部、末项底部也有空隙 */
}

.record-item {
    padding: 15px 5px; /* 保留内部空间，确保内容不拥挤 */
    margin-bottom: 12px; /* 核心：子项底部外边距，直接控制子项间空隙（数值可改） */
    border-radius: 6px; /* 可选优化：加圆角让子项更独立，空隙更明显 */
    background-color: #fff; /* 强制子项背景白色，避免与父容器混淆 */
    transition: background-color 0.2s;
}


/* 取消最后一项的下边框（可选优化，避免空隙底部多一条线） */
.record-item:last-child {
    border-bottom: none;
    /* 可根据需要添加 margin-bottom: 8px; 让最后一项底部也有一致空隙 */
}

.order-number {
    font-size: 15px;
    color: #333;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
}

.order-number .copy-icon {
    color: #888;
    cursor: pointer;
}

.record-details {
    display: grid;
    gap: 8px 0;
    font-size: 14px;
}

.detail-item .status-tag{
    color: #fff;
}

.detail-item span {
    color: #888;
    margin-left: 4px;
}

/* 状态标签样式 - 白色文字 */
.status-tag {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    color: white; /* 所有状态文字统一白色 */
}

.status-pending {
    background-color: #FF9800; /* 审核中 - 深黄色背景 */
}

.status-approved {
    background-color: #148219; /* 已通过 - 绿色背景 */
}

.status-rejected {
    background-color: #F44336; /* 已拒绝 - 红色背景 */
}

/* 金额样式 - 红色强调 */
.amount {
    color: #E64340; /* 标准红色 */
    font-weight: 500;
    font-size: 14px;
}


.empty-state {
    padding: 60px 20px;
    text-align: center;
    color: #999;
}

.empty-state .icon {
    font-size: 50px;
    color: #ddd;
    margin-bottom: 15px;
}

.empty-state .text {
    font-size: 15px;
}